<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title></title>
<link href="css/default.css" rel="stylesheet" type="text/css" />
<script type="text/javascript" src="js/jquery.latest.min.js"></script>
<link href="css/demo.css" rel="stylesheet" />
<script src="js/craftmap.js" type="text/javascript"></script>
<script type="text/javascript">
$(function(){	
	$('.demo2').craftmap({
		fullscreen: true,
		image: {
			width: 1700,
			height: 898
		}
	});	
});
</script>
</head>
<body>
<div class="demo2" style="width:800px;height:400px;"> <img src="map.png" class="imgMap" />
  <div class="marker" id="france" data-coords="760, 199">
    <h3>France</h3>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div>
  </div>
  <div class="marker" id="russia" data-coords="1130, 125">
    <!-- 1240, 260 -->
    <h3>Russia</h3>
       <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div>

	</div>
  <div class="marker" id="argentina" data-coords="425, 640">
    <h3>Argentina</h3>
       <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div> </div>
  <div class="marker" id="australia" data-coords="1430, 630">
    <h3>Australia</h3>
       <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div></div>
  <div class="marker" id="brazil" data-coords="450, 510">
    <h3>Brazil</h3>
       <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div> </div>
  <div class="marker" id="usa" data-coords="260, 232">
    <h3>USA</h3>
       <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div> </div>
  <div class="marker" id="japan" data-coords="1440, 255">
    <h3>Japan</h3>
       <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Overall Visits</span> <span class="item-count animate-number semi-bold" data-value="2415" data-animation-duration="700">2,415</span> </div>
    </div>
    <div class="widget-stats">
      <div class="wrapperstats"> <span class="item-title">Today's</span> <span class="item-count animate-number semi-bold" data-value="751" data-animation-duration="700">751</span> </div>
    </div>
    <div class="widget-stats ">
      <div class="wrapperstats last"> <span class="item-title">Monthly</span> <span class="item-count animate-number semi-bold" data-value="1547" data-animation-duration="700">1,547</span> </div>
    </div>
    <div class="description" style="margin-top:10px"> <span class="text-white mini-description " >4% higher <span class="blend">than last month</span></span></div> </div>
</div>
<div class="controls"> <a href="#" rel="france">France</a> <a href="#" rel="russia">Russia</a> <a href="#" rel="argentina">Argentina</a> <a href="#" rel="australia">Australia</a> <a href="#" rel="usa">USA</a> </div>
</body>
</html>
